<template>
  <table class="tb">
    <thead>
      <tr>
        <th>
          <input type="checkbox" />
        </th>
        <th>编号</th>
        <th>品牌名称</th>
        <th>价格</th>
        <th>数量</th>
        <th>操作</th>
      </tr>
    </thead>

    <tbody>
      <tr v-for="item in rows" :key="item.id">
        <td>
          <input type="checkbox" :value="item.id" />
        </td>
        <td>{{ item.id }}</td>
        <td>{{ item.productName }}</td>
        <td>{{ item.price }}</td>
        <td>
          <button
            @click="$emit('update', { id: item.id, newCount: item.count - 1 })"
          >
            -
          </button>
          {{ item.count }}
          <button
            @click="$emit('update', { id: item.id, newCount: item.count + 1 })"
          >
            +
          </button>
        </td>
        <td>
          <button @click="$emit('delete', item.id)">删除</button>
        </td>
      </tr>
    </tbody>
  </table>
</template>

<script>
export default {
  props: {
    rows: {
      type: Array,
    },
  },
};
</script>
